<template>
    <div class="index">
        <Header></Header>
        <div class="main">
            <p class="current-nav">
                当前位置 :
                <router-link to="index">首页</router-link>
                <i>></i>
                <a>企业信息录入管理</a>
                <i>></i>基本信息
            </p>
            <div class="infor basic" style="margin-bottom:0;">
                <p class="title">基本信息</p>
                <ul class="clearfix steps">
                    <li class="steps-active">
                        <span>1</span>
                        <p>基本信息</p>
                        <p class="info_note clearfix">
                            <i class="el-icon-warning-outline"></i>
                            <span>请正确填写单位基本信息，该信息会自动更新到对应的应急预案中！</span>
                        </p>
                    </li>
                    <li>
                        <span>2</span>
                        <p>风险信息</p>
                        <p class="info_note clearfix">
                            <i class="el-icon-warning-outline"></i>
                            <span>请录入单位涉及的全部风险信息再进入下一步，否则可能导致推荐的应急预案不完整！</span>
                        </p>
                    </li>
                    <li>
                        <span>3</span>
                        <p>应急资源信息</p>
                        <p class="info_note clearfix">
                            <i class="el-icon-warning-outline"></i>
                            <span>请正确填写应急资源信息，该信息会自动更新到应急预案中！</span>
                        </p>
                    </li>
                </ul>
                <div class="form-container">
                    <el-form
                        :model="ruleForm"
                        :rules="rules"
                        ref="ruleForm"
                        label-width="184px"
                        class="demo-ruleForm"
                    >
                        <el-form-item label="企业账号 :">
                            <el-input v-model="varCode" disabled></el-input>
                        </el-form-item>
                        <!--<el-form-item label="主要负责人 :">
					<el-input v-model="ruleForm.varLegalPerson" disabled></el-input>
                        </el-form-item>-->
                        <!--	<el-form-item label="联系电话 :">
					<el-input v-model="ruleForm.contactInfo" disabled></el-input>
                        </el-form-item>-->
                        <!--<el-form-item label="电子邮箱 :">
					<el-input v-model="ruleForm.email" disabled></el-input>
                        </el-form-item>-->
                        <!--<el-form-item label="所属行业 :">
					<el-select v-model="ruleForm.region" placeholder="选择行业" disabled>
						<el-option label="区域一" value="shanghai"></el-option>
						<el-option label="区域二" value="beijing"></el-option>
					</el-select>
					<el-select v-model="ruleForm.region" placeholder="选择企业" disabled>
						<el-option label="区域一" value="shanghai"></el-option>
						<el-option label="区域二" value="beijing"></el-option>
					</el-select>
					<el-select v-model="ruleForm.region" placeholder="行业细分" disabled>
						<el-option label="区域一" value="shanghai"></el-option>
						<el-option label="区域二" value="beijing"></el-option>
					</el-select>
                        </el-form-item>-->
                        <el-form-item label="负责气象信息的部门 :" prop="meteorologicalDept" v-if="meteorSeen">
                            <el-input
                                class="firstValue"
                                v-model="ruleForm.meteorologicalDept"
                                maxlength="20"
                            ></el-input>
                        </el-form-item>
                        <el-form-item label="负责后勤的部门 :" prop="logisticsDept" v-if="logisticsSeen">
                            <el-input
                                class="firstValue1"
                                v-model="ruleForm.logisticsDept"
                                maxlength="20"
                            ></el-input>
                        </el-form-item>
                        <el-form-item label="负责综合事务管理的部门 :" prop="servicesManageDept">
                            <el-input
                                class="firstValue2"
                                v-model="ruleForm.servicesManageDept"
                                maxlength="20"
                            ></el-input>
                        </el-form-item>
                        <el-form-item label="负责财务管理的部门 :" prop="financeDept">
                            <el-input
                                class="firstValue3"
                                v-model="ruleForm.financeDept"
                                maxlength="20"
                            ></el-input>
                        </el-form-item>
                        <el-form-item label="负责安全管理的部门 :" prop="safetyDept">
                            <el-input
                                class="firstValue4"
                                v-model="ruleForm.safetyDept"
                                maxlength="20"
                            ></el-input>
                        </el-form-item>
                        <el-form-item label="负责设备管理的部门 :" prop="equipmentManageDept" v-if="equipmentSeen">
                            <el-input
                                class="firstValue5"
                                v-model="ruleForm.equipmentManageDept"
                                maxlength="20"
                            ></el-input>
                        </el-form-item>
                        <el-form-item label="负责保卫事务的部门 :" prop="securityDept" v-if="securitySeen">
                            <el-input
                                class="firstValue6"
                                v-model="ruleForm.securityDept"
                                maxlength="20"
                            ></el-input>
                        </el-form-item>
                        <el-form-item label="负责物资管理的部门 :" prop="materialDept" v-if="materialSeen">
                            <el-input
                                class="firstValue9"
                                v-model="ruleForm.materialDept"
                                maxlength="20"
                            ></el-input>
                        </el-form-item>
                        <el-form-item label="负责人事管理的部门 :" prop="personnelManageDept" v-if="personnelSeen">
                            <el-input
                                class="firstValue10"
                                v-model="ruleForm.personnelManageDept"
                                maxlength="20"
                            ></el-input>
                        </el-form-item>
                        <el-form-item label="负责工程管理的部门 :" prop="engineeringManageDept" v-if="engineeringSeen">
                            <el-input
                                class="firstValue11"
                                v-model="ruleForm.engineeringManageDept"
                                maxlength="20"
                            ></el-input>
                        </el-form-item>
                        <el-form-item label="上级单位 :" prop="parentName">
                            <el-input
                                class="firstValue7"
                                v-model="ruleForm.parentName"
                                maxlength="20"
                            ></el-input>
                        </el-form-item>
                        <el-form-item label="预案备案部门 :" prop="emergencyDept">
                            <el-input
                                class="firstValue8"
                                v-model="ruleForm.emergencyDept"
                                maxlength="20"
                            ></el-input>
                        </el-form-item>
                        <el-form-item label="公司概况 :" prop="varCompanyDesc" v-if="companySeen">
                            <el-input
                                type="textarea"
                                v-model="ruleForm.varCompanyDesc"
                                v-bind:placeholder="comNote | comNotes"
                            ></el-input>
                            <el-button class="example" @click="examplePop">示例</el-button>
                        </el-form-item>
                        <el-form-item label="项目概况 :" prop="projectDesc" v-if="projectSeen">
                            <el-input
                                type="textarea"
                                v-model="ruleForm.projectDesc"
                                placeholder="叙述工程项目的基本情况，包括项目地址、投资规模、地理位置、组织机构、项目工期、项目施工内容、主体工程等信息"
                            ></el-input>
                            <el-button class="example" @click="proExampleFlag = true">示例</el-button>
                        </el-form-item>
                        <el-form-item label="区域位置图 :">
                            <div class="chose_btn">
                                <el-input type="text" v-model="positionName" disabled></el-input>
                                <p>· 文件格式可为.jpeg、jpg、png等格式</p>
                                <input type="text" v-show="false" v-model="ruleForm.position" />
                                <div class="select_btn">
                                    <el-upload
                                        action="api/userCenter/uploadFile/doUploadFast"
                                        ref="reportUpload"
                                        :on-change="changeimg1"
                                        :http-request="newload"
                                        accept=".jpg, .png, .jpeg, .gif"
                                        :before-upload="beforeAvatarUpload"
                                    >
                                        <el-button v-loading="loading1">选择...</el-button>
                                    </el-upload>
                                </div>
                                <!--<div class="account-delete" @click="cancelthree(1)" v-if="positionName"><i class="el-icon-remove"></i></div>-->
                            </div>
                        </el-form-item>
                        <el-form-item label="平面布置图 :">
                            <div class="chose_btn">
                                <el-input type="text" v-model="planePositionName" disabled></el-input>
                                <p>· 文件格式可为.jpeg、jpg、png等格式</p>
                                <input type="text" v-show="false" v-model="ruleForm.planePosition" />
                                <div class="select_btn">
                                    <el-upload
                                        action="api/userCenter/uploadFile/doUploadFast"
                                        ref="reportUpload"
                                        :on-change="changeimg2"
                                        :http-request="newload1"
                                        :before-upload="beforeAvatarUpload"
                                        accept=".jpg, .png, .jpeg, .gif"
                                    >
                                        <el-button v-loading="loading2">选择...</el-button>
                                    </el-upload>
                                </div>
                                <!--	<div class="account-delete" @click="cancelthree(2)" v-if="planePositionName"><i class="el-icon-remove"></i></div>-->
                            </div>
                        </el-form-item>
                        <el-form-item label="紧急疏散图 :">
                            <div class="chose_btn">
                                <el-input type="text" v-model="emergencyExitName" disabled></el-input>
                                <p>· 文件格式可为.jpeg、jpg、png等格式</p>
                                <input type="text" v-show="false" v-model="ruleForm.emergencyExit" />
                                <div class="select_btn">
                                    <el-upload
                                        action="/emergency/v1.0/upload/file"
                                        ref="reportUpload"
                                        :on-change="changeimg3"
                                        :http-request="newload2"
                                        accept=".jpg, .png, .jpeg, .gif"
                                        :before-upload="beforeAvatarUpload"
                                    >
                                        <el-button v-loading="loading3">选择...</el-button>
                                    </el-upload>
                                </div>
                                <!--<div class="account-delete" @click="cancelthree(3)" v-if="emergencyExitName"><i class="el-icon-remove"></i></div>-->
                            </div>
                        </el-form-item>
                    </el-form>
                    <div class="bts">
                        <el-button @click="submitForm('ruleForm',0)" class="cancel">保存</el-button>
                        <el-button type="primary" @click="submitForm('ruleForm',1)" class="sure">下一步</el-button>
                    </div>
                </div>
            </div>
        </div>
        <Footer />

        <!--公司概况---火力发电-->
        <el-dialog
            title="示例"
            :visible.sync="exampleFlag1"
            width="60%"
            :append-to-body="true"
            onselectstart="return false"
        >
            <div class="exampleMain">
                <div class="exampleCon">
                    <h3>公司概况</h3>
                    <h4>（1）基本情况</h4>
                    <p>
                        XX公司是XX集团控股的大型发展中的火力发电企业，成立于XX年XX月XX日，总投资XX万元，装机总容量XXMW……
                        公司厂址位于XX，占地面积为XX平方米，东侧是XX，西侧是XX……
                        目前，公司员工人数XX，管理人员XX，一线员工XX……
                    </p>
                    <p>公司气候常年受东南季风环流的控制和影响，四季分明，年平均气温为……</p>
                    <h4>（2）主要生产系统</h4>
                    <h5>（1）输煤系统</h5>
                    <p>公司燃用XX煤，燃煤输送系统采用带式输送机，燃煤70%主要由火车经XX铁路运输……</p>
                    <h5>（2）燃烧制粉系统</h5>
                    <p>制粉系统采用中间储仓式热风送粉系统，采用XX型齿索式输粉机……</p>
                    <h5>（3）汽水系统</h5>
                    <p>#1、2机组汽轮机为凝汽式供热汽轮机，额定功率为……</p>
                    <h5>（4）电气系统</h5>
                    <p>发电机在额定频率、额定电压、额定功率因数、额定氢压和额定冷却介质条件下，机端连续输出额定功率为……</p>
                </div>

                <div class="exampleBtn">
                    <a class="submit" @click="exampleFlag1 = false">确 定</a>
                </div>
            </div>
        </el-dialog>

        <!--公司概况---水力发电-->
        <el-dialog
            title="示例"
            :visible.sync="exampleFlag2"
            width="60%"
            :append-to-body="true"
            onselectstart="return false"
        >
            <div class="exampleMain">
                <div class="exampleCon">
                    <h3>公司概况</h3>
                    <h4>（1）基本情况</h4>
                    <p>
                        XX公司是XX集团控股的大型发展中的水力发电企业，成立于XX年XX月XX日，总投资XX万元，
                        其基本职责是负责XX水利枢纽及其反调节水库的日常运行维护管理……
                    </p>
                    <p>水力发电厂位于XX，占地面积为XX平方米，东侧是XX，西侧是XX……</p>
                    <p>目前，公司员工人数XX，管理人员XX，一线员工XX……</p>
                    <p>公司气候常年受东南季风环流的控制和影响，四季分明，年平均气温为……</p>
                    <h4>（2）水利枢纽组成</h4>
                    <p>XX水利枢纽由拦水大坝、泄洪排沙系统和引水发电系统三部分组成，有X个进水塔、X条泄洪排沙洞、X个二级消力池、
                        X条发电引水洞和地下厂房等重要设施。枢纽含各类闸门XX扇、过水孔口XX个，有多台套充水平压系统和复杂的卷扬启闭设备；
                        发电部分装有X台单机容量为XXMW的混流式水轮发电机组和输变电设备，多年平均发电量XX亿kWh……</p>
                    <p>水力发电厂管辖范围为XX水利枢纽区域，包括大坝、进水塔、坝顶控制楼、地面副厂房、开关站、地下厂房、各供水泵站、工区各变电所……</p>
                </div>

                <div class="exampleBtn">
                    <a class="submit" @click="exampleFlag2 = false">确 定</a>
                </div>
            </div>
        </el-dialog>

        <!--公司概况---冶金行业-->
        <el-dialog
            title="示例"
            :visible.sync="exampleFlag3"
            width="60%"
            :append-to-body="true"
            onselectstart="return false"
        >
            <div class="exampleMain">
                <div class="exampleCon">
                    <h3>公司概况</h3>
                    <h4>（1）基本情况</h4>
                    <p>
                        XX公司是XX集团控股的大型发展中的冶金（钢铁）企业，成立于XX年XX月XX日，总投资XX万元……
                    </p>
                    <p>公司位于XX，占地面积为XX平方米，东侧是XX，西侧是XX……</p>
                    <p>目前，公司员工人数XX，管理人员XX，一线员工XX……</p>
                    <h4>（2）产品及机械设备</h4>
                    <p>冶金（钢铁）企业主要从事钢材、钢坯的国内贸易、进出口贸易及钢材加工等业务。其原料包括铁矿、铬矿、锰矿、煤炭等，主要产品包括钢材/坯、精铜……</p>
                    <p>公司炼铁设备有高炉炉顶设备、水冷传动齿轮箱、炉前液压泥炮……，炼钢设备有精炼设备、连铸设备、轧钢设备、液压传动设备……。高炉炉顶设备型号为……</p>
                </div>

                <div class="exampleBtn">
                    <a class="submit" @click="exampleFlag3 = false">确 定</a>
                </div>
            </div>
        </el-dialog>

        <!--公司概况---石化建设-->
        <el-dialog
            title="示例"
            :visible.sync="exampleFlag4"
            width="60%"
            :append-to-body="true"
            onselectstart="return false"
        >
            <div class="exampleMain">
                <div class="exampleCon">
                    <h3>公司概况</h3>
                    <h4>（1）基本情况</h4>
                    <p>
                        XX公司是XX集团控股的大型发展中的石油工程建设公司，成立于XX年XX月XX日，总投资XX万元……
                    </p>
                    <p>公司位于XX，占地面积为XX平方米，东侧是XX，西侧是XX……</p>
                    <p>目前，公司员工人数XX，管理人员XX，一线员工XX……</p>
                    <h4>（2）业务范围</h4>
                    <p>公司业务涵盖国内外油气水长输管道工程、石油和天然气集输处理工程、大型储罐工程、石油化工配套工程、地热能源工程、海洋油气工程、
                        公路桥梁工程、工业与民用建筑工程、市政公用工程、热力、发电、送变电工程、消防公用工程、电气仪表自动化工程、通信、防腐保温工程、
                        钢结构工程施工及压力容器制造安装等领域的工程勘察、概念设计、详细设计、施工、工程总承包和项目管理，以及相关技术、
                        工艺包和产品的研发和服务……</p>
                </div>

                <div class="exampleBtn">
                    <a class="submit" @click="exampleFlag4 = false">确 定</a>
                </div>
            </div>
        </el-dialog>

        <!--公司概况---建筑（公司级）-->
        <el-dialog
            title="示例"
            :visible.sync="exampleFlag5"
            width="60%"
            :append-to-body="true"
            onselectstart="return false"
        >
            <div class="exampleMain">
                <div class="exampleCon">
                    <h3>公司概况</h3>
                    <h4>（1）基本情况</h4>
                    <p>
                        XX公司是XX集团控股的大型发展中的建设公司，成立于XX年XX月XX日，总投资XX万元……
                    </p>
                    <p>公司位于XX，占地面积为XX平方米，东侧是XX，西侧是XX……</p>
                    <p>目前，公司员工人数XX，管理人员XX，一线员工XX……</p>
                    <h4>（2）业务范围</h4>
                    <p>公司业务涵盖国内外钢构工程、工业安装、公路桥梁工程、工业与民用建筑工程、市政公用工程、消防公用工程、电气仪表自动化工程、
                        通信、防腐保温工程、钢结构工程施工及压力容器制造安装等领域的工程勘察、概念设计、详细设计、施工、工程总承包和项目管理，
                        以及相关技术、工艺包和产品的研发和服务……</p>
                </div>

                <div class="exampleBtn">
                    <a class="submit" @click="exampleFlag5 = false">确 定</a>
                </div>
            </div>
        </el-dialog>

        <!--项目概况-->
        <el-dialog
            title="示例"
            :visible.sync="proExampleFlag"
            width="60%"
            :append-to-body="true"
            onselectstart="return false"
        >
            <div class="exampleMain">
                <div class="exampleCon">
                    <h3>项目概况</h3>
                    <h4>（1）基本情况</h4>
                    <p>
                        XX工程区位于XX，占地面积为XX平方米，东侧是XX，西侧是XX……，总投资XX万元……。XX工程项目预计工期为X年，起始时间为XXXX年XX月，预计完成时间为XXXX年XX月……
                    </p>
                    <h4>（2）主体工程基本信息</h4>
                    <p>项目主体工程包括混凝土工程、砌体工程、钢结构工程等，其中，混凝土工程包括模板工程、钢筋工程、预应力工程、混凝土工程、现浇结构工程、
                        装配式结构工程、混凝土结构子分部工程；砌体工程包括砌筑砂浆、砖砌体工程、混凝土小型空心砌块砌体工程、石砌体工程、配筋砌体工程、
                        填充墙体砌体工程、冬期施工；钢结构工程包括原材料及成品进场、钢结构焊接工程、紧固件连接工程、钢零件及钢部件加工工程、钢构件组装工程、
                        钢构件预拼装工程、单层钢结构安装工程、多层及高层钢结构……</p>
                </div>

                <div class="exampleBtn">
                    <a class="submit" @click="proExampleFlag = false">确 定</a>
                </div>
            </div>
        </el-dialog>
    </div>
</template>

<script>
import Header from "../common/header";
import Footer from "../common/footer";

export default {
    components: {
        Header,
        Footer
    },
    data() {
        return {
            exampleFlag1: false,
            exampleFlag2: false,
            exampleFlag3: false,
            exampleFlag4: false,
            exampleFlag5: false,
            proExampleFlag: false,
            ruleForm: {
                companyId: "", //单位id
                emergencyDept: "", //预案备案部门 9
                emergencyExit: "", //
                equipmentManageDept: "", //设备安全管理部 6
                financeDept: "", //  负责财务管理的部门 4
                //  "legalPerson": "",
                logisticsDept: "", //负责后勤的部门 2
                meteorologicalDept: "", //负责气象信息部门 1
                parentName: "", //上级单位名称 8
                planePosition: "",
                position: "",
                safetyDept: "", //安全部 5
                securityDept: "", //保卫部 7
                servicesManageDept: "", //综合事务管理部门 3
                varCompanyDesc: "", //公司概况
                projectDesc: "", //项目概况
                materialDept: "", //负责物资管理的部门
                personnelManageDept: "", //负责人事管理的部门
                engineeringManageDept: "" //负责工程管理的部门
            },
            rules: {
                meteorologicalDept: [
                    {
                        required: true,
                        message: "请输入负责气象信息部门",
                        trigger: "blur"
                    }
                ],
                logisticsDept: [
                    {
                        required: true,
                        message: "请输入负责后勤的部门",
                        trigger: "blur"
                    }
                ],
                servicesManageDept: [
                    {
                        required: true,
                        message: "请输入综合事务管理部门",
                        trigger: "blur"
                    }
                ],
                financeDept: [
                    {
                        required: true,
                        message: "负责财务管理的部门",
                        trigger: "blur"
                    }
                ],
                safetyDept: [
                    {
                        required: true,
                        message: "请输入安全部",
                        trigger: "blur"
                    }
                ],
                equipmentManageDept: [
                    {
                        required: true,
                        message: "请输入设备安全管理部",
                        trigger: "blur"
                    }
                ],
                securityDept: [
                    {
                        required: true,
                        message: "请输入保卫部",
                        trigger: "blur"
                    }
                ],
                parentName: [
                    {
                        required: true,
                        message: "请输入上级单位名称",
                        trigger: "blur"
                    }
                ],
                emergencyDept: [
                    {
                        required: true,
                        message: "请填写预案备案部门",
                        trigger: "blur"
                    }
                ],
                varCompanyDesc: [
                    {
                        required: true,
                        message: "请填写公司概况",
                        trigger: "blur"
                    }
                ],
                projectDesc: [
                    {
                        required: true,
                        message: "请填写项目概况",
                        trigger: "blur"
                    }
                ],
                materialDept: [
                    {
                        required: true,
                        message: "请填写物资管理部门",
                        trigger: "blur"
                    }
                ],
                personnelManageDept: [
                    {
                        required: true,
                        message: "请填写人事管理部门",
                        trigger: "blur"
                    }
                ],
                engineeringManageDept: [
                    {
                        required: true,
                        message: "请填写工程管理部门",
                        trigger: "blur"
                    }
                ]
            },
            varCode: "",
            emergencyExitName: "",
            positionName: "",
            planePositionName: "",
            loading1: false,
            loading2: false,
            loading3: false,
            changeList: false,
            projectSeen: true,//项目概况显示与否
            materialSeen: true,//物资管理部门显示与否
            logisticsSeen: true,//后勤部门显示与否
            meteorSeen: true,//气象信息部门显示与否
            equipmentSeen: true,//设备管理部门显示与否
            securitySeen: true,//保卫事务部门显示与否
            companySeen: true, //公司概况显示与否
            personnelSeen: false, //人事管理部门显示与否
            engineeringSeen: false, //工程管理部门显示与否
            comNote:localStorage.businessId, //公司概况placeholder提示语
        };
    },
    created() {
        // if(localStorage.getItem("ruleForm")){
        //     this.ruleForm = JSON.parse(localStorage.getItem("ruleForm"));
        // }
        this.lookcompany();
        this.showPart()
    },
    methods: {
        //基本信息根据行业显示不同部门
        showPart(){
            var busyId = localStorage.businessId
            if(busyId == 6 || busyId == 7 || busyId == 34){ //火力发电、水力发电、冶金行业
                this.projectSeen = false
                this.materialSeen = false
            }
            if(busyId == 14 || busyId == 13){ //火电建设、水电建设
                this.meteorSeen = false
                this.logisticsSeen = false
                this.equipmentSeen = false
                this.securitySeen = false
                this.companySeen = false
            }
            if(busyId == 62){ //石化建设
                this.meteorSeen = false
                this.logisticsSeen = false
                this.equipmentSeen = false
                this.securitySeen = false
                this.projectSeen = false
                this.materialSeen = false
            }
            if(busyId == 67){ //公司级
                this.meteorSeen = false
                this.logisticsSeen = false
                this.securitySeen = false
                this.projectSeen = false
                this.materialSeen = false
                this.personnelSeen = true
                this.engineeringSeen = true
            }
            if(busyId == 18 || busyId == 19 || busyId == 22){ //房建、市政、公路
                this.meteorSeen = false
                this.logisticsSeen = false
                this.securitySeen = false
                this.companySeen = false
                this.materialSeen = false
                this.engineeringSeen = true
            }
        },
        //根据行业显示不同公司概况弹出层
        examplePop(){
            var busiId = localStorage.businessId;
            if (busiId == 6){
                this.exampleFlag1 = true
            }
            if (busiId == 7){
                this.exampleFlag2 = true
            }
            if (busiId == 34){
                this.exampleFlag3 = true
            }
            if (busiId == 62){
                this.exampleFlag4 = true
            }
            if (busiId == 67){
                this.exampleFlag5 = true
            }
        },
        submitForm(formName, n) {
            this.$refs[formName].validate(valid => {
                if (valid) {
                    console.log(this.ruleForm);
                    if (this.loading1 || this.loading2 || this.loading3) {
                        this.$message({
                            message: "文件还没有完全上传",
                            type: "error"
                        });
                        return false;
                    }
                    let params = {
                        companyId: JSON.parse(localStorage.getItem("user"))
                            .companyId,
                        // "contactInfo": "string",
                        // "contacter": "string",
                        emergencyDept: this.ruleForm.emergencyDept,
                        emergencyExit: this.ruleForm.emergencyExit,
                        equipmentManageDept: this.ruleForm.equipmentManageDept,
                        financeDept: this.ruleForm.financeDept,
                        // "legalPerson": this.ruleForm.legalPerson,
                        logisticsDept: this.ruleForm.logisticsDept,
                        meteorologicalDept: this.ruleForm.meteorologicalDept,
                        parentName: this.ruleForm.parentName,
                        planePosition: this.ruleForm.planePosition,
                        position: this.ruleForm.position,
                        safetyDept: this.ruleForm.safetyDept,
                        securityDept: this.ruleForm.securityDept,
                        servicesManageDept: this.ruleForm.servicesManageDept,
                        companyDesc: this.ruleForm.varCompanyDesc,
                        projectDesc: this.ruleForm.projectDesc,
                        materialDept: this.ruleForm.materialDept,
                        personnelManageDept: this.ruleForm.personnelManageDept,
                        engineeringManageDept: this.ruleForm.engineeringManageDept
                    };
                    console.log(params);
                    // if(this.changeList){
                    //   this.$router.push('risk')
                    //   return false;
                    // }
                    this.$axios({
                        method: "post",
                        url: this.$baseUrl + "emergency/v1.0/company/perfect",
                        data: params
                    }).then(res => {
                        let data = res.data.meta;
                        if (data.success) {
                            this.$message({
                                message: "保存成功",
                                type: "success"
                            });
                            if (n == 1) {
                                this.$router.push("risk");
                            }
                        } else {
                            this.$message({
                                message: res.data.meta.msg,
                                type: "error"
                            });
                        }
                    });
                    localStorage.setItem("ruleForm", "");
                }
            });
        },
        resetForm(formName) {
            this.$refs[formName].resetFields();
        },
        changeimg1(file, fileList) {
            this.positionName = file.name;
            this.loading1 = true;
        },
        changeimg2(file, fileList) {
            this.planePositionName = file.name;
            this.loading2 = true;
        },
        changeimg3(file, fileList) {
            this.emergencyExitName = file.name;
            this.loading3 = true;
        },
        newload(file, index) {
            let url = this.$baseUrl + "emergency/v1.0/upload/file";
            var fd = new FormData();
            fd.append("file", file.file);
            let config = {
                headers: {
                    "Content-Type": "multipart/form-data"
                }
            };
            this.$axios.post(url, fd, config).then(res => {
                console.log(res);
                this.ruleForm.position = res.data.data;
                this.loading1 = false;
            });
        },
        newload1(file, index) {
            let url = this.$baseUrl + "emergency/v1.0/upload/file";
            var fd = new FormData();
            fd.append("file", file.file);
            let config = {
                headers: {
                    "Content-Type": "multipart/form-data"
                }
            };
            this.$axios.post(url, fd, config).then(res => {
                console.log(res);
                this.ruleForm.planePosition = res.data.data;
                this.loading2 = false;
            });
        },
        newload2(file, index) {
            let url = this.$baseUrl + "emergency/v1.0/upload/file";
            var fd = new FormData();
            fd.append("file", file.file);
            let config = {
                headers: {
                    "Content-Type": "multipart/form-data"
                }
            };
            this.$axios.post(url, fd, config).then(res => {
                console.log(res);
                this.ruleForm.emergencyExit = res.data.data;
                this.loading3 = false;
            });
        },
        lookcompany() {
            let params = {
                companyId: JSON.parse(localStorage.getItem("user")).companyId
            };
            this.$axios({
                method: "post",
                url: this.$baseUrl + "emergency/v1.0/company/info",
                data: params
            }).then(res => {
                let data = res.data.data;
                console.log(data);

                this.varCode = JSON.parse(
                    localStorage.getItem("user")
                ).userAccount;
                if (data.varEmergencyDept) {
                    this.changeList = true;
                    this.$store.state.changestate = 2;
                }
                this.ruleForm.emergencyDept = data.varEmergencyDept; //预案备案部门 9
                this.ruleForm.emergencyExit = data.varemergencyExit; //预案备案部门 9
                this.ruleForm.financeDept = data.varFinanceDept; //预案备案部门 9
                this.ruleForm.logisticsDept = data.varLogisticsDept; //预案备案部门 9
                this.ruleForm.meteorologicalDept = data.varMeteorologicalDept; //预案备案部门 9
                this.ruleForm.parentName = data.varParentName; //预案备案部门 9
                this.ruleForm.planePosition = data.varPlanePosition; //预案备案部门 9
                this.ruleForm.position = data.varPosition; //预案备案部门 9
                this.ruleForm.servicesManageDept = data.varServicesManageDept; //预案备案部门 9
                this.ruleForm.safetyDept = data.varSafetyDept; //预案备案部门 9
                this.ruleForm.equipmentManageDept = data.varEquipmentManageDept; //预案备案部门 9
                this.ruleForm.securityDept = data.varSecurityDept;
                this.ruleForm.position = data.varAreaPosition;
                this.ruleForm.planePosition = data.varPlanePosition;
                this.ruleForm.emergencyExit = data.varEmergencyExit;
                this.ruleForm.varCompanyDesc = data.varCompanyDesc;
                this.ruleForm.projectDesc = data.varProjectDesc;
                this.ruleForm.materialDept = data.varMaterialDept;
                this.ruleForm.personnelManageDept = data.varPersonnelManageDept;
                this.ruleForm.engineeringManageDept = data.varEngineeringManageDept;

                if (data.varAreaPosition) {
                    this.positionName = JSON.parse(
                        data.varAreaPosition
                    ).fileName;
                }
                if (data.varPlanePosition) {
                    this.planePositionName = JSON.parse(
                        data.varPlanePosition
                    ).fileName;
                }
                if (data.varEmergencyExit) {
                    this.emergencyExitName = JSON.parse(
                        data.varEmergencyExit
                    ).fileName;
                }
                // this.ruleForm.emergencyDept =data.varemergencyDept; //预案备案部门 9
                // this.$forceUpdate();
            });
        },
        cancelthree(index) {
            if (index == 2) {
                this.planePositionName = "";
                this.ruleForm.planePosition = "";
            } else if (index == 1) {
                this.positionName = "";
                this.ruleForm.position = "";
            } else if (index == 3) {
                this.emergencyExitName = "";
                this.ruleForm.emergencyExit = "";
            }
        },
        beforeAvatarUpload(file) {
            var testmsg = /^image\/(jpeg|png|jpg)$/.test(file.type);
            const isLt4M = file.size / 1024 / 1024 <= 4; //图片大小不超过2MB
            if (!testmsg) {
                this.$message.error("上传图片格式不对!");
                return false;
            }
            if (!isLt4M) {
                this.$message.error("上传图片大小不能超过 4M!");
                return false;
            }
            return testmsg && isLt4M;
        },
        changelook(file) {
            var testmsg = /^image\/(jpeg|png|jpg)$/.test(file.type);
            const isLt4M = file.size / 1024 / 1024 <= 4; //图片大小不超过2MB
            if (!testmsg) {
                this.$message.error("上传图片格式不对!");
                return false;
            }
            if (!isLt4M) {
                this.$message.error("上传图片大小不能超过 4M!");
                return false;
            }
            return false;
        }
    },
    filters:{
        comNotes:function(value){
            if(value == 6){return "叙述公司的基本情况，包括隶属关系、生产规模、地理位置、从业人数、气候情况及主要生产系统等信息"}
            if(value == 7){return "叙述公司的基本情况，包括隶属关系、生产规模、地理位置、从业人数、气候情况及水利枢纽组成等信息"}
            if(value == 34){return "叙述公司的基本情况，包括公司地址、从业人数、隶属关系、主要原材料、主要产品、产量及机械设备等信息"}
            if(value == 62 || value == 67){return "叙述公司的基本情况，包括公司地址、从业人数、隶属关系、业务涵盖范围等信息"}
        }
    },
    destroyed() {
        //window.localStorage.setItem("ruleForm",JSON.stringify(this.ruleForm));
    }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang='less'>
@import "../../../static/css/information.less";
.basic {
    .form-container {
        width: 766px;
        padding: 50px 0 70px;
        margin: 0 auto;
        .el-button {
            width: 136px;
            height: 42px;
        }
        .el-input,
        .el-textarea {
            width: 424px;
        }
        .el-textarea {
            .el-textarea__inner {
                resize: none;
                height: 200px;
                border-radius: 8px;
            }
        }
        .example {
            width: 86px;
            margin-left: 7px;
            border-radius: 8px;
            border-color: #2476fe;
        }
        .el-select {
            .el-input {
                width: 176px;
            }
            margin-right: 20px;
        }
        .el-select:last-child {
            margin: 0;
        }
        .chose_btn {
            height: 36px;
            margin-bottom: 20px;
            position: relative;
            input:first-child {
                width: 424px;
                height: 42px;
                text-indent: 10px;
                border: 1px solid #dddddd;
                border-radius: 8px;
                color: #cccccc;
                float: left;
                margin-right: 12px;
            }
            input:first-child::placeholder {
                color: #cccccc;
            }
            p {
                position: absolute;
                top: 40px;
            }
            .select_btn {
                float: right;
                text-align: center;
                color: #7254e8;
                width: 86px;
                font-size: 12px;
                border: 1px solid #2476fe;
                height: 44px;
                overflow: hidden;
                border-radius: 8px;
                margin-right: 60px;
                input {
                    position: absolute;
                    top: 0;
                    left: 412px;
                }
            }
            .el-button {
                width: 86px;
                border: 0;
            }
            .account-delete {
                position: absolute;
                top: 0;
                right: 0;
                padding-top: 4px;
                cursor: pointer;
                > i {
                    font-size: 34px;
                    color: red;
                }
            }
        }
    }
}
.exampleMain {
    .exampleCon {
        h3 {
            margin-bottom: 10px;
            font-weight: bold;
        }
        h4 {
            margin: 5px 0;
            font-weight: bold;
        }
        h5 {
            padding-left: 1.5em;
        }
        p {
            padding-left: 3em;
        }
    }
    .exampleBtn {
        text-align: right;
        margin-top: 20px;
        .submit {
            display: inline-block;
            border-radius: 8px;
            height: 36px;
            text-align: center;
            line-height: 36px;
            height: 36px;
            width: 85px;
            color: #fff;
            border: none;
            cursor: pointer;
            background: #4080ff;
            background: linear-gradient(left, #6fb2ff 0%, #095fff 100%);
        }
        .submit:hover {
            opacity: 0.8;
        }
    }
}
</style>

